package myJs.detailInfo

import cats.effect.IO
import japgolly.scalajs.react.ScalaFnComponent
import japgolly.scalajs.react.util.EffectCatsEffect._
import japgolly.scalajs.react.vdom.all._
import myJs.myPkg.Hooks._
import myJs.myPkg.tabs._

/** Created by yz on 28/11/2023
  */
object IndelCp {

  case class Props(id: String)

  val Component = ScalaFnComponent[Props] { props =>
    val (hasIndelSummary, setHasIndelSummary) = useState(true)
    val (hasIndelSnp, setHasIndelSnp) = useState(true)
    val (hasIndelInterSnp, setHasIndelInterSnp) = useState(true)
    val initTab = List("inDelSummary", "inDelSnp", "inDelInterSnp")(0)
    val (tab, setTab) = useState(initTab)

    object FTool {

      def tabChange = (v: String) => {
        setTab(v)
      }

    }

    useEffect(
      {
        if (
          (!hasIndelSummary && tab == "inDelSummary") || (!hasIndelSnp && tab == "inDelSnp") || (!hasIndelInterSnp && tab == "inDelInterSnp")
        ) {
          val curTab =
            List(("inDelSummary", hasIndelSummary), ("inDelSnp", hasIndelSnp), ("inDelInterSnp", hasIndelInterSnp))
              .filter(_._2)
              .headOption
              .map(_._1)
              .getOrElse("")
          setTab(curTab)
        } else IO {}
      },
      List(hasIndelSummary, hasIndelSnp, hasIndelInterSnp)
    )

    if (List(hasIndelSummary, hasIndelSnp, hasIndelInterSnp).exists(x => x)) {
      div(
        h4("InDel"),
        Tabs(id = "tab", activeKey = tab, onSelect = FTool.tabChange, transition = false)(
          if (hasIndelSummary) {
            Tab(eventKey = "inDelSummary", title = s"InDel Summary")(
              div(
                marginTop := 20.px,
                IndelSummaryCp(id = props.id, hasChange = setHasIndelSummary.toIO)
              )
            )
          } else EmptyVdom,
          if (hasIndelSnp) {
            Tab(eventKey = "inDelSnp", title = s"InDel SNPs")(
              div(
                marginTop := 20.px,
                IndelSnpCp(id = props.id, hasChange = setHasIndelSnp.toIO)
              )
            )
          } else EmptyVdom,
          if (hasIndelInterSnp) {
            Tab(eventKey = "inDelInterSnp", title = s"InDel Intergenic SNPs")(
              div(
                marginTop := 20.px,
                IndelInterSnpCp(id = props.id, hasChange = setHasIndelInterSnp.toIO)
              )
            )
          } else EmptyVdom
        )
      )
    } else EmptyVdom

  }

  def apply(id: String) = {
    Component(Props(id))
  }

}
